<!--回弹业务数据字典---回弹仪器设备管理---查看-->
<template>
  <div class="department" id="department">
    <!-- 右侧 -->
    <div class="department_right">
      <!-- 顶部导航栏 -->
      <div class="app-container-btn">
        <el-button type="primary" @click="yj_saveForm('formData')">
          保存
        </el-button>
        <el-button @click="goBack">返回</el-button>
      </div>

      <!-- 表格 -->
      <div class="text_table TensionRealTime">
        <div class="dialogBody common table_detail" style="overflow: hidden">
          <div style="overflow-y: auto; margin-bottom: 20px">
            <div class="app-container-area-title">
              <span class="app-container-area-title-divider"></span>
              <span>生产配合比信息</span>
            </div>
            <div class="publicForm">
              <publicForm
                ref="publicForm"
                lableWidth="125px"
                :formObj="formObjText"
                :formData="formData"
              >
              </publicForm>
            </div>
            <div class="mixProportion">
              <div class="titleBig">
                <div class="title" style="width: 20%; border-left: none">
                  项目
                </div>
                <div class="title">水泥</div>
                <div class="title">砂</div>
                <div class="title title1" style="width: 24%">
                  <div class="title1_1">碎石</div>
                  <div class="title1_2">
                    <div class="title1_2_1" style="border-left: none">1</div>
                    <div class="title1_2_1">2</div>
                    <div class="title1_2_1">3</div>
                  </div>
                </div>
                <div class="title">水</div>
                <div class="title">减水剂</div>
                <div class="title title1" style="width: 16%">
                  <div class="title1_1">外渗料</div>
                  <div class="title1_2">
                    <div class="title1_2_2" style="border-left: none">
                      粉煤灰
                    </div>
                    <div class="title1_2_2">矿渣粉</div>
                  </div>
                </div>
                <div class="title">防水添加剂</div>
              </div>
              <div
                class="titleSmall"
                v-for="(v, i) in formData.materialList"
                :key="i"
              >
                <div
                  class="title2"
                  style="width: 20%; border-left: none"
                  v-text="v[0]"
                ></div>
                <div class="title2">
                  <el-input
                    v-model="v[1]"
                    placeholder="/"
                    :disabled="disabled"
                  ></el-input>
                </div>
                <div class="title2">
                  <el-input
                    v-model="v[2]"
                    placeholder="/"
                    :disabled="disabled"
                  ></el-input>
                </div>
                <div class="title2">
                  <el-input
                    v-model="v[3]"
                    placeholder="/"
                    :disabled="disabled"
                  ></el-input>
                </div>
                <div class="title2">
                  <el-input
                    v-model="v[4]"
                    placeholder="/"
                    :disabled="disabled"
                  ></el-input>
                </div>
                <div class="title2">
                  <el-input
                    v-model="v[5]"
                    placeholder="/"
                    :disabled="disabled"
                  ></el-input>
                </div>
                <div class="title2">
                  <el-input
                    v-model="v[6]"
                    placeholder="/"
                    :disabled="disabled"
                  ></el-input>
                </div>
                <div class="title2">
                  <el-input
                    v-model="v[7]"
                    placeholder="/"
                    :disabled="disabled"
                  ></el-input>
                </div>
                <div class="title2">
                  <el-input
                    v-model="v[8]"
                    placeholder="/"
                    :disabled="disabled"
                  ></el-input>
                </div>
                <div class="title2">
                  <el-input
                    v-model="v[9]"
                    placeholder="/"
                    :disabled="disabled"
                  ></el-input>
                </div>
                <div class="title2">
                  <el-input
                    v-model="v[10]"
                    placeholder="/"
                    :disabled="disabled"
                  ></el-input>
                </div>
              </div>
            </div>
            <div class="publicForm">
              <publicForm
                ref="publicForm0"
                lableWidth="125px"
                :formObj="formObjText1"
                :formData="formData"
                :timestamp="formData.fFillingfile"
                :fileList="fSourcefileList"
                @delteFile="delteFile"
              >
              </publicForm>
            </div>

            <div class="app-container-area-title">
              <span class="app-container-area-title-divider"></span>
              <span>测量情况</span>
            </div>

            <el-collapse v-model="activeNames" @change="changeCollapse">
              <el-collapse-item name="0">
                <template slot="title">
                  <div>
                    <img
                      style="vertical-align: middle"
                      src="@/assets/img/Supervision/com_flg.png"
                      alt=""
                    />
                    <span style="margin-left: 8px">场站坍落度实测</span>
                  </div>
                </template>
                <!-- <div
                  class="publicForm"
                  :style="{
                    height:
                      formData.fIsabandon == '否' || formData.fIsabandon == null
                        ? '320px'
                        : '140px',
                  }"
                  style="margin-top: 3px"
                > -->
                <div class="publicForm" style="margin-top: 3px">
                  <publicForm
                    ref="publicForm1"
                    lableWidth="125px"
                    @selectChange="selectChange"
                    :formObj="handleObjText"
                    :formData="formData"
                    :timestamp="formData.fStationfile"
                    :fileList="stationfileList"
                    @delteFile="delteFile"
                    @inputFocus="inputFocus"
                  >
                  </publicForm>
                </div>
              </el-collapse-item>
            </el-collapse>
            <!-- <div style="height: 50px"></div> -->
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import {
  getConcreteRecipeByFid, //详情
  saveConcreteRecipeByStation, //保存
  // getStationmachineByfMachineid, //调骨料名接口
  getBaseDepartmentUser, //查人员
} from "@/api/request.js";
import actions from "@/actions";
import TableData from "@/components/HntManage/el-tables"; //主页面列表
import Pagination from "@/components/public/el-pagination"; //主页面分页
import publicForm from "@/components/public/el-form.vue"; //弹框form
import formJs from "./regexDetail.js"; //新增弹框配置项

export default {
  inject: ["reload"],
  name: "StationCollapseText",
  data() {
    return {
      name: "StationCollapseText",
      Fdata: null,

      yj_edit: null,
      // yj_delete: null,
      yj_submit: null,

      fId: null, //当前行数据fId
      loading: false, //列表转载
      table_config: formJs.table_configText,
      tableData: [], //表格列表数据列表
      // 列表
      // 弹框
      timeYMD: null, //当前日期
      btnShow: true,
      disabled: true,
      dialogTitle: "",
      loadingEditDialog: false, //弹框loading
      dialogEditVisible: false, //新增弹框是否显示
      formObjText: formJs.formObjs,
      formObjText1: formJs.formObj1s,
      handleObjText: formJs.handleObjs,
      handleObjs: formJs.handleObjs, //场站编辑
      handleObj: formJs.handleObj, //场站查看
      formData: formJs.formData,
      recordfiles: [], //删除文件
      fSourcefileList: [],
      stationfileList: [],
      saveData: formJs.saveData,
      getUserInitialList: [], //人员列表初始值
      // 弹框

      // 弹框2
      loadingEditDialogSC: false, //弹框loading
      dialogEditVisibleSC: false, //新增弹框是否显示
      formObjSC: formJs.formObjSC, //生产任务单弹框
      baseData: formJs.baseData,
      isShow: false,
      navigatepageNums1: null, //是否显示分页
      queryCriteriaData1: {}, //分页
      aggregateData: ["骨料1", "骨料2", "骨料3", "骨料4", "骨料5"],
      tableData1: [],
      tableList: {
        companyid: "", // 施工标段id
        taskNumber: "",
        page: 1, // 当前页码
        pageSize: 3, // 每页显示条数
      },
      // 弹框2
      activeNames: ["0"],
      userInfo: {}, //登录用户
    };
  },
  components: {
    TableData, //主页面列表
    Pagination, //分页
    publicForm, //表单
  },
  created() {},
  mounted() {
    actions.onGlobalStateChange((state, prev) => {
      this.userInfo = prev.currentUser;
      console.log(this.userInfo);
    }, true);
    this.getData();
  },
  methods: {
    goBack() {
      // this.$router.back();
      this.$router.push("/hntManage/StationCollapse");
      window.sessionStorage.removeItem("GxEmbedded_HntMixProportion");
      // window.sessionStorage.removeItem("GxEmbedded_Station_treePeople");
      window.sessionStorage.removeItem("GxEmbedded_StationCollapseTextFormData");
    },
    // 获取详情
    getConcrete(id) {
      getConcreteRecipeByFid({ fId: id })
        .then((res) => {
          // console.log(5555,res.data.concreteRecipe.fIsabandon);
          this.loadingEditDialog = false; //弹框loading
          if (
            JSON.parse(sessionStorage.getItem("GxEmbedded_StationCollapseTextFormData"))
          ) {
            this.formData = JSON.parse(
              sessionStorage.getItem("GxEmbedded_StationCollapseTextFormData")
            );
          } else {
            this.formData = res.data.concreteRecipe;
            this.formData.fStationtestdates = this.timeYMD;
            this.formData.fStationtesterid = this.userInfo.id; // 场站实测人id
            this.formData.fStationtestername = this.userInfo.userName; // 场站实测人名称
          }
          if (JSON.parse(sessionStorage.getItem("GxEmbedded_Station_treePeople"))) {
            var treePeopleData = JSON.parse(
              sessionStorage.getItem("GxEmbedded_Station_treePeople")
            );
            this.formData.fAppointsitetesterid = treePeopleData.fUserid;
            this.formData.fAppointsitetestername = treePeopleData.fRealname;
          }
          if (
            this.formData.fIsabandon == null ||
            this.formData.fIsabandon == "" ||
            this.formData.fIsabandon == "否"
          ) {
            this.formData.fIsabandon = "否";
            this.handleObjText[1].label = "检测说明";
            this.handleObjText[2].label = "场站实测人";
            this.handleObjText[3].label = "场站检测日期";
            this.handleObjText[1].rules[0].required = false;
            this.handleObjText[2].rules[0].required = true;
            this.handleObjText[3].rules[0].required = true;
            this.handleObjText[4].rules[0].required = true;
            this.handleObjText[5].rules[0].required = true;
            this.handleObjText[6].rules[0].required = false;
          } else if (this.formData.fIsabandon == "是") {
            this.handleObjText[1].label = "作废原因";
            this.handleObjText[2].label = "作废人";
            this.handleObjText[3].label = "作废时间";
            this.handleObjText[1].rules[0].required = true;
            this.handleObjText[2].rules[0].required = true;
            this.handleObjText[3].rules[0].required = true;
            this.handleObjText[4].rules[0].required = false;
            this.handleObjText[5].rules[0].required = false;
            this.handleObjText[6].rules[0].required = false;
          }

          this.fSourcefileList = res.data.fillingfile;
          this.stationfileList = res.data.stationfile;
        })
        .catch((err) => {
          console.log(err);
        });
    },
    selectChange(data, a, b) {
      console.log(data);
      if (b == "fIsabandon") {
        if (data == "否") {
          this.formData.fIsabandon = "否";
          this.handleObjText[1].label = "检测说明";
          this.handleObjText[2].label = "场站实测人";
          this.handleObjText[3].label = "场站检测日期";

          this.handleObjText[1].rules[0].required = false;
          this.handleObjText[2].rules[0].required = true;
          this.handleObjText[3].rules[0].required = true;
          this.handleObjText[4].rules[0].required = true;
          this.handleObjText[5].rules[0].required = true;
          this.handleObjText[6].rules[0].required = false;
        } else if (data == "是") {
          this.handleObjText[1].label = "作废原因";
          this.handleObjText[2].label = "作废人";
          this.handleObjText[3].label = "作废时间";
          this.handleObjText[1].rules[0].required = true;
          this.handleObjText[2].rules[0].required = true;
          this.handleObjText[3].rules[0].required = true;
          this.handleObjText[4].rules[0].required = false;
          this.handleObjText[5].rules[0].required = false;
          this.handleObjText[6].rules[0].required = false;
        }
      }
    },
    // 保存
    yj_saveForm() {
      if (this.$refs.publicForm1.submitForm()) {
        this.getUserInitialList.map((v) => {
          if (this.formData.fAppointsitetestername == v.fRealname) {
            this.formData.fAppointsitetesterid = v.fUserid;
          }
        });

        this.saveData = {
          fId: this.Fdata.fId,
          fIsabandon: this.formData.fIsabandon,
          fStationtestslump: this.formData.fStationtestslump, // 场站实测塌落度
          fStationtestdates: this.formData.fStationtestdates, // 场站检测日期
          fStationtesterid: this.formData.fStationtesterid, // 场站实测人id
          fStationtestername: this.formData.fStationtestername, // 场站实测人名称
          fStationtestnote: this.formData.fStationtestnote, // 场站检测说明
          fAppointsitetesterid: this.formData.fAppointsitetesterid, // 指定现场塌落度检测人id
          fAppointsitetestername: this.formData.fAppointsitetestername, // 指定现场塌落度检测人名称
          recordfiles: this.recordfiles,
        };
        saveConcreteRecipeByStation(this.saveData)
          .then((res) => {
            if (res.errcode == 0) {
              this.$router.push("/hntManage/stationCollapse");
              window.sessionStorage.removeItem("GxEmbedded_HntMixProportion");
              // window.sessionStorage.removeItem("GxEmbedded_coordinate_Wbs_Deta");
              window.sessionStorage.removeItem("GxEmbedded_StationCollapseTextFormData");
            } else {
              this.$message.error(res.msg);
              console.log("接口报错");
            }
          })
          .catch((error) => {
            console.log(error);
          });
      } else {
        console.log("error");
      }
    },

    // 获取页面容器高度
    getHeight() {
      var h = document.documentElement.clientHeight; //获取页面可见高度
      this.dialogHeight = h * 0.36 + "px";
    },
    // 点击查看
    yj_viewForm(row, label) {
      this.row = row;
      this.fId = row.fId;
      if (label == "配合比通知单编号") {
        this.editText(this.fId);
      } else if (label == "生产任务单编号") {
        this.editText2(row);
      }
    },

    // // 查看
    // editText(id) {
    //   this.dialogTitle = "查看";
    //   this.btnShow = false;
    //   this.disabled = true;
    //   this.handleObjText = this.handleObj;
    //   if (id != "" && id != null) {
    //     this.loadingEditDialog = true; //弹框loading
    //     this.dialogEditVisible = true;
    //     getConcreteRecipeByFid({ fId: id })
    //       .then((res) => {
    //         if (res.errcode == 0) {
    //           var that = this;
    //           that.loadingEditDialog = false;
    //           this.formData = res.data.concreteRecipe;
    //           this.fSourcefileList = res.data.fillingfile;
    //           this.stationfileList = res.data.stationfile;
    //           if (
    //             res.data.concreteRecipe.fIsabandon == null ||
    //             res.data.concreteRecipe.fIsabandon == "" ||
    //             res.data.concreteRecipe.fIsabandon == "否"
    //           ) {
    //             this.formData.fIsabandon = "否";
    //             this.handleObjText[1].label = "检测说明";
    //             this.handleObjText[2].label = "场站实测人";
    //             this.handleObjText[2].label = "场站检测日期";
    //           } else if (res.data.concreteRecipe.fIsabandon == "是") {
    //             this.handleObjText[1].label = "作废原因";
    //             this.handleObjText[2].label = "作废人";
    //             this.handleObjText[3].label = "作废时间";
    //           }
    //         } else {
    //           this.$message.error("查看", res.msg);
    //           this.loadingEditDialog = false;
    //         }
    //       })
    //       .catch(() => {
    //         console.log("查看---详情接口报错");
    //         this.loadingEditDialog = false;
    //       });
    //   } else {
    //     return this.$message.error("请先选择需要查看的数据");
    //   }
    // },
    // 弹框2
    editText2(row) {
      // if (row.fMachineid !== "" && row.fMachineid !== null) {
      this.dialogEditVisibleSC = true;
      this.loadingEditDialogSC = true;
      this.tableList.taskNumber = row.fProducetasknumber;
      this.tableList.companyid = row.fCompanyid;
      this.tableList.page = 1;

      this.isShow = true;
      getTotalAmountDetail(this.tableList)
        .then((res) => {
          if (res.errcode == 0) {
            var that = this;
            that.dialogEditVisibleSC = true;
            that.loadingEditDialogSC = false;
            that.tableData1 = res.data.pageInfo.list;

            this.baseData = {
              F_ProduceTaskNumber: row.fProducetasknumber, // 生产任务编号
              F_EngineeringName: row.fEnginerringname, // 工程名称
              F_EngineeringPartName: row.fEnginerringpart, // 工程部位
              F_StrengthGrade: row.fStrengthlevel, // 强度等级
              F_DischargeDates: that.tableData1[0].F_DischargeDates, // 出料时间
            };
            that.queryCriteriaData1 = res.data.pageInfo; //分页信息
            that.navigatepageNums1 =
              that.queryCriteriaData1.navigatepageNums.length;
          }
        })
        .catch(() => {
          console.log("任务单详情接口报错");
        });
    },
    // 驻拌合站试验人下拉框
    getUser(id) {
      getBaseDepartmentUser({ fCompanyid: id })
        .then((res) => {
          if (res.errcode == 0) {
            this.getUserInitialList = []; //人员列表初始值
            var getUser = {
              value: "",
              label: "",
            };
            var getUserList = []; //人员列表过滤后

            res.data.childList.map((v) => {
              if (v.fDepartmentId == this.userInfo.departmentId) {
                this.getUserInitialList = v.personList;
                this.getUserInitialList.map((v) => {
                  getUser = {
                    value: v.fRealname,
                    label: v.fRealname,
                  };
                  getUserList.push(getUser);
                });
              }
            });
            this.formObj1[2].options = getUserList;
          } else {
            this.$message.error(res.msg);
            console.log("部门管理-查询部门列表以及下属人员,接口报错");
          }
        })
        .catch((error) => {
          console.log("部门管理-查询部门列表以及下属人员", error);
        });
    },
    indexMethod(index) {
      return index + 1 + (this.tableList.page - 1) * 3; // page是当前的页码，size是页码容量
    },
    handleCurrentChange(val) {
      this.tableList.page = val;
      this.tableList.taskNumber = this.row.fProducetasknumber;
      this.tableList.companyid = this.row.fCompanyid;
      getTotalAmountDetail(this.tableList).then((res) => {
        if (res.errcode == 0) {
          var that = this;
          that.tableData1 = res.data.pageInfo.list;
          this.queryCriteriaData1 = res.data.pageInfo; //分页信息
          this.navigatepageNums1 =
            this.queryCriteriaData1.navigatepageNums.length;
        } else {
          this.$message.error(res.msg);
        }
      });
    },
    handleSizeChange(val) {
      console.log(`每页 ${val} 条`);
    },
    // 折叠面板
    changeCollapse(e) {
      return this.activeNames, e;
      // console.log(this.activeNames, e);
    },
    // 弹框2
    getData() {
      var time = new Date();
      const y = time.getFullYear();
      const m = (time.getMonth() + 1 + "").padStart(2, "0");
      const d = (time.getDate() + "").padStart(2, "0");
      this.timeYMD = `${y}-${m}-${d}`;

      if (JSON.parse(sessionStorage.getItem("GxEmbedded_HntMixProportion"))) {
        this.Fdata = JSON.parse(sessionStorage.getItem("GxEmbedded_HntMixProportion"));

        this.getConcrete(this.Fdata.fId);
        this.getUser(this.Fdata.fCompanyid);
      }
    },
    inputFocus(index, prop) {
      window.sessionStorage.setItem(
        "GxEmbedded_StationCollapseTextFormData",
        JSON.stringify(this.formData)
      );
      console.log(index, prop);
      if (prop == "fAppointsitetestername") {
        this.$router.push({
          path: "/public/treePeople",
          query: {
            text: "2",
          },
        });
      }
    },
    // 点击当前
    rowChange(val) {
      this.row = val;
      this.fId = val.fId;
    },
 
    // 多选方法
    selectionChange() {},
    // 排序方法
    sortChange() {},
  },
};
</script>

<style scoped>
.printTables {
  background: #fff;
  display: flex;
  justify-content: end;
  padding: 5px;
  margin-top: 10px;
}

.dialogBody {
  padding: 3px 20px;
  height: 100%;
  overflow-y: auto;
}

.baseTitle {
  /* border: 1px solid #0c204d; */
  border-bottom: 1px solid #0c204d;
  height: 30px;
  line-height: 30px;
  position: relative;
  padding-left: 15px;
}

.baseTitle::after {
  display: block;
  content: "";
  height: 30px;
  width: 5px;
  position: absolute;
  left: 0;
  top: 0;
  background: #0c204d;
}
/* 砼配合比表格 */
.mixProportion {
  width: 99%;
  height: 150px;
  margin: 20px 0;
  border-top: 1px solid #ccc;
  border-left: 1px solid #ccc;
  border-right: 1px solid #ccc;
}
.titleBig {
  width: 100%;
  height: 60px;
  border-bottom: 1px solid #ccc;
  display: flex;
  justify-content: space-between;
}
.title {
  height: 100%;
  width: 8%;
  display: flex;
  align-items: center;
  justify-content: center;
  border-left: 1px solid #ccc;
  font-size: 12px;
  font-weight: 700;
}
.title1 {
  display: flex;
  flex-direction: column;
}
.title1_1 {
  width: 100%;
  height: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  border-bottom: 1px solid #ccc;
}
.title1_2 {
  width: 100%;
  height: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.title1_2_1 {
  width: 33%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  border-left: 1px solid #ccc;
}
.title1_2_2 {
  width: 50%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  border-left: 1px solid #ccc;
}
.titleSmall {
  width: 100%;
  height: 30px;
  border-bottom: 1px solid #ccc;
  /* background: #0c204d; */
  display: flex;
}
.title2 {
  width: 8%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  border-left: 1px solid #ccc;
}
.titleSmall /deep/ .el-input__inner {
  height: 27px !important;
  line-height: 26px !important;
  text-align: center;
  border: none;
}
.titleSmall /deep/ .el-input {
  line-height: 28px !important;
}
/* 砼配合比表格 */
/* 任务单弹框 */
.Multi_level_header /deep/.el-table__body-wrapper tr {
  height: 80px !important;
}

.Multi_level_header /deep/.el-table__body-wrapper .lineBoxhidden {
  height: 64px !important;
  line-height: 22px !important;
}

.Multi_level_header /deep/.el-table .el-table__body-wrapper .cell {
  height: 100% !important;
}

.materialClass /deep/.el-table tr:nth-child(4) {
  display: none;
}

#materialPage /deep/ .bgwarn2 {
  background: #e6a23c !important;
  color: #fff !important;
}

#materialPage /deep/ .bgwarn1 {
  background: #409eff !important;
  color: #fff !important;
}

#materialPage /deep/ .bgwarn3 {
  background-color: #f56c6c !important;
  color: #fff !important;
}

#materialPage /deep/ .bgwarn4 {
  background-color: rgb(212, 179, 137) !important;
  color: #fff !important;
}
/* 任务单弹框 */
</style>
